
{% extends 'site.html' %}
{% block css %}
<style>
.diggit {
    float: left;
    width: 46px;
    height: 52px;
    background: url('/static/img/img.png') no-repeat;
    text-align: center;
    cursor: pointer;
    margin-top: 2px;
    padding-top: 5px;
}
.buryit {
    float: right;
    margin-left: 20px;
    width: 46px;
    height: 52px;
    background: url('/static/img/img_1.png') no-repeat;
    text-align: center;
    cursor: pointer;
    margin-top: 2px;
    padding-top: 5px;
}
.clear {
    clear: both;
}
.diggword {
    margin-top: 5px;
    margin-left: 0;
    font-size: 12px;
    color: #808080;
}
#div_digg {
    float: right;
    margin-bottom: 10px;
    margin-right: 30px;
    font-size: 12px;
    width: 125px;
    text-align: center;
    margin-top: 10px;
}
</style>
{% endblock %}

{% block article %}
  <h1>{{ article_obj.title }}</h1>
    <div class="article_content">
    {{ article_obj.content|safe }}
    </div>
   <div>
   <div id="div_digg">
    <div class="diggit action" >
        <span class="diggnum" id="digg_count">0</span>
    </div>
    <div class="buryit action" >
        <span class="burynum" id="bury_count">0</span>
    </div>
    <div class="clear"></div>
    <div class="diggword" id="digg_tips">
    </div>
</div>
   </div>




{% endblock %}
{% block js %}
    <script>
    $('.action').click(function (){
        let isup=$(this).hasClass('diggit');
        let $div=$(this);
        $.ajax({
            url:'/up_or_down/',
            type:'post',
            data:{
                'article_id':'{{ article_obj.pk }}',
                'is_up':isup,
                'csrfmiddlewaretoken':'{{ csrf_token }}'
            },
            success:function (args){
                if(args.code==1000){
                    $('#digg_tips').text(args.msg)
                    let oldNum=$div.children().text();
                    $div.children().text(Number(oldNum)+1)

                }else{
                    $('#digg_tips').html(args.msg)
                }
            }
        })

    })

    </script>
{% endblock %}